import React,{lazy,Suspense} from 'react'
import {Route,Redirect,Switch} from 'react-router-dom'
// import {Loading} from "antd-mobile";

import Frontpage from './Frontpage'
import Loading from '../Loading'
import Bar from './Bar'
import style from './index.module.css'
const {title,home} = style
const Classification = lazy(()=>import('./Classification'))
const Shopping_cart = lazy(()=>import('./Shopping_cart'))
const My = lazy(()=>import('./My'))

export default function Home(){
    return (
        <div className={home}>
            <p className={title}>青桃</p>
            <Switch>
                <Redirect exact from='/home' to='/home/frontpage'/>
                <Route path='/home/frontpage' component={Frontpage}/>
                <Suspense fallback={<Loading/>}>
                    <Route path='/home/classification' component={Classification}/>
                    <Route path='/home/shopping_cart' component={Shopping_cart}/>
                    <Route path='/home/my' component={My}/>
                </Suspense>
                
            </Switch>
            <Bar />
        </div>
    )
}